<template>
  <div>
    <div class="mx">
      <van-nav-bar
        title="测试记录"
        right-text="成绩数据"
        @click-right=""
      ></van-nav-bar>
      <div>
        <div class="card" @click="readWork">
          <div class="classname"><b>
            <van-icon name="description"></van-icon>
            <b class="setcname">高数</b></b></div>
          <div><b>
            <van-icon name="question" class="sicon"></van-icon>
          </b><font class="setcname">马巧梅 18235462547</font></div>
          <div>
            <van-icon name="clock" class="sicon"></van-icon>
            <font class="setcname">2018-2-28</font></div>
        </div>
        <div class="card">
          <div class="classname"><b>
            <van-icon name="description"></van-icon>
            <b class="setcname">高数</b></b></div>
          <div>
            <van-icon name="question" class="sicon"></van-icon>
            马巧梅 18235462547
          </div>
          <div>
            <van-icon name="clock" class="sicon"></van-icon>
            2018-2-28
          </div>
        </div>
      </div>

    </div>

  </div>
</template>

<script>

  export default {
    name: "test-msg",

    data() {
      return {
        active: 1
      }
    },
    methods:{
      readWork() {
        this.$router.push({path: '/showMsg'})
      }
    }
  }
</script>

<style scoped>
  .card {
    padding-top: 8px;
    padding-left: 15px;
    padding-bottom: 7px;
    box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.2);
    border-radius: 9px;
    margin-top: 5px;
    color: rgb(100, 100, 100);
    border-right: 10px solid rgb(43, 255, 0);
  }

  .classname {
    padding: 0 0 3px 0;
    font-size: 20px;
  }

  .setcname {
    padding-left: 5px;
  }

  .sicon {
    color: rgb(22, 145, 216);
  }
</style>
